import React from 'react';
import {inject, observer} from 'mobx-react';
// import DevTools from 'mobx-react-devtools'
import { Button } from 'antd';
import { WeaTop,WeaRightMenu, WeaTab, WeaSearchGroup, WeaInput, WeaSelect, WeaPopoverHrm } from 'ecCom';
import { WeaSwitch } from 'comsMobx'
import { Form, Pagination, Col, Row } from 'antd';

import MultiExchanges from './MultiExchanges';
import * as workplanUtil from '../../util/workplanUtil';
import '../../style/workPlanExchange.less';
import WorkPlanCreate from '../../public/workPlanCreate/index';
import {WeaLocaleProvider} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;
// import allStore from '../stores';


@inject('workPlanExchangeStore')
@observer
class WorkPlanExchange extends React.Component {
    componentDidMount() {
        const { workPlanExchangeStore } = this.props;
        workPlanExchangeStore.initData({
            CompParams: {viewcondition: 1}
        });
    }

    componentWillReceiveProps(nextProps) {
        if(nextProps.location && this.props.location.key !== nextProps.location.key) {
            const { workPlanExchangeStore } = this.props;
            workPlanExchangeStore.initData({
                CompParams: {viewcondition: workPlanExchangeStore.viewcondition}
            });
        }
      }

      componentWillUnmount(){
        const { workPlanExchangeStore } = this.props;
        workPlanExchangeStore.ifShowSearchAd = false;
      }

      workPlanCreateChangeTab = (newKey) => {
        this.props.workPlanExchangeStore.setActiveKey(newKey);
      }

      workPlanCreateClose = () => {
        const { workPlanExchangeStore } = this.props;
        workPlanExchangeStore.closeCreateWP();
        workPlanExchangeStore.doSearch();
        //为了在我的日程页面显示正确而设置
        workPlanExchangeStore.setActiveKey('1');
      }

      workPlanCreateOnlyClose = () => {
        const { workPlanExchangeStore } = this.props;
        workPlanExchangeStore.closeCreateWP();
        workPlanExchangeStore.doSearch();
        //为了在我的日程页面显示正确而设置
        workPlanExchangeStore.setActiveKey('1');
      }

      onEnterSearch = () => {
        const { workPlanExchangeStore } = this.props;
        const viewcondition = workPlanExchangeStore.form.getFormParams().timeSag;
        const store = workPlanExchangeStore;
        if(store === undefined) return;
        if (viewcondition == 6) {
            store.setCurrent(1, () => {
            store.doSearch({
                CompParams: {
                viewcondition: '0'
                }
            });
            });
        } else {
            store.setCurrent(1, () => {
            store.doSearch({
                CompParams: {
                viewcondition: viewcondition || '0'
                }
            });
            });
        }
      }

    render() {
        let topTab = [
            {
                groupid: 'flowAll',
                title: `${getLabel(332,'全部')}`,
                viewcondition: 0
            },
        
            {
                groupid: 'flowNew',
                title: `${getLabel(15537,'今天')}`,
                viewcondition: 1
            },
            {
                groupid: 'flowNew',
                title: `${getLabel(15539,'本周')}`,
                viewcondition: 2
            },
            {
                groupid: 'flowNew',
                title: `${getLabel(15541,'本月')}`,
                viewcondition: 3
            },
            {
                groupid: 'flowNew',
                title: `${getLabel(21904,'本季')}`,
                viewcondition: 4
            },
            {
                groupid: 'flowNew',
                title: `${getLabel(15384,'本年')}`,
                viewcondition: 5
            },
        ];
        const { workPlanExchangeStore } = this.props;
        const {count, currentpage, pagesize} = workPlanExchangeStore;
        return (
            <div className="workPlanExchange">
                <WeaPopoverHrm ecId={`${this && this.props && this.props.ecId || ''}_WeaPopoverHrm@2kx3d4`}/>
                {/* <DevTools></DevTools> */}
                <WorkPlanCreate ecId={`${this && this.props && this.props.ecId || ''}_WorkPlanCreate@up297y`}
                    type={'preview'}
                    visible={workPlanExchangeStore.ifShowCreateWP}
                    doClose={this.workPlanCreateClose}
                    //关闭回调,只做关闭操作
                    onlyClose={this.workPlanCreateOnlyClose}
                    workPlanId = {workPlanExchangeStore.workPlanId} //日程id
                    activeKey={workPlanExchangeStore.activeKey}
                    changeTab={this.workPlanCreateChangeTab}
                />
                    <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@d3kmmm`}
                        title={getLabel(33506,'工作交流')}
                        loading={workPlanExchangeStore.loading}
                        icon={<i className='icon-coms-schedule' />}
                        iconBgcolor='#6D3CF8'
                        showDropIcon={false}
                        buttons={[]}
                        ref={'workplanExchangeTop'}
                    >
                        <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@m9n5sy`}
                            datas={topTab}
                            keyParam="viewcondition"  //主键
                            countParam="groupid" //数量
                            selectedKey={ workPlanExchangeStore.viewcondition }
                            searchType={['advanced']}
                            showSearchAd={workPlanExchangeStore.ifShowSearchAd}
                            //这里接收的是切换显隐之后相应的bool值
                            setShowSearchAd={bool=>{
                                workPlanExchangeStore.setShowSearchAd(bool)
                            }}
                            searchsAd={workplanUtil.getSearchs(workPlanExchangeStore, this.onEnterSearch)}
                            buttonsAd={workplanUtil.getTabButtonsAd(workPlanExchangeStore)}

                            // onSearch={v=>{workPlanExchangeStore.doSearch()}}
                            // onSearchChange={v=>{workPlanExchangeStore.setFormFields({planName:{value:v}})}}
                            //上四行toto

                            onChange={ (key) => {
                                //重置之前可能设置过的分页的相关筛选条件的信息
                                workPlanExchangeStore.setCurrent(1);
                                workPlanExchangeStore.setPagesize(10);


                                workPlanExchangeStore.initData({
                                    CompParams: {
                                        viewcondition: key
                                    }
                                });
                            }}
                            advanceHeight={120}
                        />

                        <MultiExchanges ecId={`${this && this.props && this.props.ecId || ''}_MultiExchanges@57pbr2`}
                            parentRefs={this.refs.workplanExchangeTop}
                        />
                        <div
                            style={{
                                position: 'fixed',
                                left: 0,
                                bottom: 0,
                                width: '100%',
                                height: 46,
                                'box-shadow': '0 -1px 0 0 #D6D6D6',
                                background: '#FFFFFF',
                            }}
                        >
                            {/*<Row type="flex" align="middle" style={{height: 46}}>*/}
                                {/*<Col offset={15} span={9}>*/}
                                <div style={{float: 'right',
                                    padding: '8px 10px'}}
                                >
                                    <Pagination ecId={`${this && this.props && this.props.ecId || ''}_Pagination@zkysvo`}
                                        showSizeChanger
                                        showQuickJumper
                                        current={currentpage}
                                        total={count}
                                        pagesize={pagesize}
                                        showTotal={total => `${getLabel(18609,'共')}${total}${getLabel(18256,'条')}`}
                                        onShowSizeChange={(current, pageSize) => {
                                            workPlanExchangeStore.setPagesize(pageSize)
                                            workPlanExchangeStore.setCurrent(1)
                                            workPlanExchangeStore.doSearch()
                                        }}
                                        onChange={nextCurrent => {
                                            workPlanExchangeStore.setCurrent(nextCurrent)
                                            workPlanExchangeStore.doSearch()
                                        }}
                                    />
                                </div>

                                {/*</Col>*/}
                            {/*</Row>*/}



                        </div>

                    </WeaTop>
            </div>
        )
    }
}

export default WorkPlanExchange